/**
 * 修复文件编码问题
 */
const fs = require('fs');
const path = require('path');

// 完全重写DataSourceExample.jsx
const dataSourceExample = `/**
 * @file 数据源示例组件
 * 
 * 展示如何使用低代码平台的数据源系统
 */
import React, { useState, useEffect } from 'react';
import { 
  DataSource, 
  StaticDataSource, 
  ApiDataSource, 
  ComputedDataSource 
} from '../data/DataSource.jsx';
import dataSourceRegistry from '../data/DataSourceRegistry.jsx';

/**
 * 数据源示例组件
 */
const DataSourceExample = () => {
  const [staticData, setStaticData] = useState(null);
  const [computedData, setComputedData] = useState(null);
  const [apiData, setApiData] = useState(null);
  const [loading, setLoading] = useState(false);
  const [error, setError] = useState(null);

  useEffect(() => {
    // 初始化示例数据源
    initDataSources();

    // 加载数据
    loadData();
  }, []);

  // 初始化数据源
  const initDataSources = () => {
    // 清除可能存在的旧数据源
    try {
      dataSourceRegistry.getDataSource('exampleStatic') && 
        dataSourceRegistry.removeDataSource('exampleStatic');
        
      dataSourceRegistry.getDataSource('exampleApi') && 
        dataSourceRegistry.removeDataSource('exampleApi');
        
      dataSourceRegistry.getDataSource('exampleComputed') && 
        dataSourceRegistry.removeDataSource('exampleComputed');
    } catch (err) {
      console.warn('清除旧数据源出错', err);
    }

    // 注册静态数据源
    dataSourceRegistry.registerDataSource({
      id: 'exampleStatic',
      name: '静态数据示例',
      type: 'static',
      options: {
        data: {
          name: '低代码平台',
          version: '1.0.0',
          features: [
            '可视化设计器',
            '数据源管理',
            '表达式引擎',
            '组件库'
          ]
        }
      }
    });

    // 注册API数据源
    dataSourceRegistry.registerDataSource({
      id: 'exampleApi',
      name: 'API数据示例',
      type: 'api',
      options: {
        // 使用模拟API地址，实际项目中应替换为真实API
        url: 'https://jsonplaceholder.typicode.com/posts/1',
        method: 'GET',
        headers: {
          'Content-Type': 'application/json'
        }
      }
    });

    // 注册计算数据源
    dataSourceRegistry.registerDataSource({
      id: 'exampleComputed',
      name: '计算数据示例',
      type: 'computed',
      options: {
        expression: \`
          ({
            platformName: exampleStatic.name,
            featureCount: exampleStatic.features.length,
            apiTitle: exampleApi.title || '加载中...',
            timestamp: new Date().toLocaleString()
          })
        \`,
        dependencies: ['exampleStatic', 'exampleApi']
      }
    });
  };

  // 加载数据
  const loadData = async () => {
    setLoading(true);
    setError(null);

    try {
      // 获取静态数据
      const staticSource = dataSourceRegistry.getDataSource('exampleStatic');
      if (staticSource) {
        const data = await staticSource.load();
        setStaticData(data);
      }

      // 获取API数据
      const apiSource = dataSourceRegistry.getDataSource('exampleApi');
      if (apiSource) {
        const data = await apiSource.load();
        setApiData(data);
      }

      // 获取计算数据
      const computedSource = dataSourceRegistry.getDataSource('exampleComputed');
      if (computedSource) {
        const data = await computedSource.load(dataSourceRegistry);
        setComputedData(data);
      }
    } catch (err) {
      console.error('加载数据源出错', err);
      setError(err.message || '加载数据失败');
    } finally {
      setLoading(false);
    }
  };

  // 刷新数据
  const refreshData = () => {
    loadData();
  };

  // 渲染数据区块
  const renderDataBlock = (title, data) => {
    return (
      <div style={{ 
        marginBottom: '20px', 
        padding: '15px', 
        border: '1px solid #eee',
        borderRadius: '5px' 
      }}>
        <h3 style={{ marginTop: 0 }}>{title}</h3>
        {data ? (
          <pre style={{ 
            backgroundColor: '#f5f5f5',
            padding: '10px',
            borderRadius: '3px',
            maxHeight: '200px',
            overflow: 'auto'
          }}>
            {JSON.stringify(data, null, 2)}
          </pre>
        ) : (
          <p>数据加载中...</p>
        )}
      </div>
    );
  };

  return (
    <div style={{ maxWidth: '800px', margin: '0 auto', padding: '20px' }}>
      <h2>数据源系统示例</h2>
      
      <div style={{ marginBottom: '20px' }}>
        <p>
          本示例展示了低代码平台中不同类型数据源的使用方式，
          包括静态数据源、API数据源和计算数据源。
        </p>
        
        <button 
          onClick={refreshData}
          disabled={loading}
          style={{
            padding: '8px 15px',
            backgroundColor: '#1890ff',
            color: 'white',
            border: 'none',
            borderRadius: '4px',
            cursor: loading ? 'not-allowed' : 'pointer',
            opacity: loading ? 0.7 : 1
          }}
        >
          {loading ? '加载中...' : '刷新数据'}
        </button>
      </div>
      
      {error && (
        <div style={{ 
          padding: '10px 15px', 
          backgroundColor: '#fff2f0', 
          border: '1px solid #ffccc7',
          borderRadius: '4px',
          marginBottom: '20px'
        }}>
          <strong>错误:</strong> {error}
        </div>
      )}
      
      <div style={{ display: 'grid', gap: '20px' }}>
        {renderDataBlock('静态数据源', staticData)}
        {renderDataBlock('API数据源', apiData)}
        {renderDataBlock('计算数据源', computedData)}
      </div>
      
      <div style={{ 
        marginTop: '30px', 
        padding: '15px', 
        backgroundColor: '#e6f7ff', 
        borderRadius: '4px' 
      }}>
        <h3>数据源说明</h3>
        <ul>
          <li><strong>静态数据源:</strong> 直接在配置中定义的数据，不需要远程获取</li>
          <li><strong>API数据源:</strong> 通过HTTP请求从远程API获取数据</li>
          <li><strong>计算数据源:</strong> 基于其他数据源，使用表达式计算生成新的数据</li>
        </ul>
      </div>
    </div>
  );
};

export default DataSourceExample;`;

// 完全重写DataBindingExample.jsx
const dataBindingExample = `/**
 * @file 数据绑定示例组件
 */
import React from "react";

const DataBindingExample = () => {
  return (
    <div>
      <h2>数据绑定示例</h2>
      <p>这是一个新创建的数据绑定示例文件</p>
    </div>
  );
};

export default DataBindingExample;`;

// 主函数
function main() {
  try {
    // 写入DataSourceExample.jsx
    fs.writeFileSync(
      path.join(__dirname, 'packages', 'renderer', 'examples', 'DataSourceExample.jsx'),
      dataSourceExample,
      { encoding: 'utf8' }
    );
    console.log('已修复 DataSourceExample.jsx');
    
    // 写入DataBindingExample.jsx
    fs.writeFileSync(
      path.join(__dirname, 'packages', 'renderer', 'examples', 'DataBindingExample.jsx'),
      dataBindingExample,
      { encoding: 'utf8' }
    );
    console.log('已修复 DataBindingExample.jsx');
    
    console.log('所有文件修复完成！');
  } catch (err) {
    console.error('修复文件时出错:', err);
  }
}

// 执行主函数
main(); 